package com.step.ems.component

import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.MutableState
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

@Composable
fun TextArea(
    title: String,
    value: MutableState<String>,
    placeholder: String? = null,
) {
    Text(
        text = title,
        modifier = Modifier
            .padding(start = 16.dp, top = 10.dp)
            .fillMaxWidth(),
        fontSize = 16.sp
    )
    MyTextField(
        value = value.value,
        textStyle = TextStyle(fontSize = 13.sp),
        modifier = Modifier
            .padding(top = 6.dp, start = 16.dp, end = 16.dp, bottom = 16.dp)
            .fillMaxWidth(),
        colors = MyTextFieldDefaults.colors(Color(0xFFF4F4F4)),
        singleLine = false,
        minLines = 3,
        contentPadding = PaddingValues(10.dp),
        onValueChange = { value.value = it },
        placeholder = {
            if (placeholder != null) Text(
                modifier = Modifier.offset(y = (-3).dp),
                text = placeholder,
                fontSize = 13.sp,
                color = Color(0xFFBBBBBB),
                style = TextStyle(fontSize = 13.sp)
            )
        },
    )
}

@Composable
fun TextAreaDisable(
    title: String,
    value: String,
) {
    Text(
        text = title,
        modifier = Modifier
            .padding(start = 16.dp, top = 10.dp)
            .fillMaxWidth(),
        fontSize = 16.sp
    )
    Text(
        text = value.ifBlank { "-" },
        fontSize = 13.sp,
        color = Color.Gray,
        modifier = Modifier
            .padding(top = 6.dp, start = 16.dp, end = 16.dp, bottom = 16.dp)
            .fillMaxWidth(),
    )
}